<template>
  <Button
    v-if="isThrough && props.type === 'link' "
    :class="props.class"
    type="link"
    :icon="props.icon"
    :disabled="props.disabled"
    danger
    @click="handleClick"
  >
    {{ props.text }}
  </Button>
  <Button
    v-if="isThrough && props.type !== 'link' "
    :class="props.class"
    :type="props.type"
    :icon="props.icon"
    :disabled="props.disabled"
    @click="handleClick"
  >
    {{ props.text }}
  </Button>
</template>


<script setup lang="ts">
import { Button } from "ant-design-vue";
import { computed } from "vue";
import { useUserStore } from "@/store";

interface PropInterface {
  type: "link" | "text" | "primary" | "default";
  text: string;
  p: string;
  class?: string;
  icon?: any;
  onClick?: () => void;
  disabled?: boolean;
}

const props = defineProps<PropInterface>();

const userStore = useUserStore();
const permissions = userStore.getPermissions;

const isThrough = computed(() => {
  // console.log('--------', props)
  if (!permissions) {
    return false;
  }
  return typeof permissions[props.p] !== "undefined";
});

const handleClick = () => {
  if (props.onClick) {
    props.onClick();
  }
};
</script>